<style lang="less" scoped>
    @import './second_layer.less';
</style>
    <template>
        <div>
            <div v-if="createdConfig.config.user_rule.rules.length > 0" ref="userattr" :class="sublen > 1? 'filter-area1' : 'filter-area'">
                <div class="condition" v-if="sublen > 1" >
                    <Button class="condition-button" v-on:click="switchConditon()">{{AndOr === 'and' ? '且' : '或'}}</Button>
                </div>
                <div v-for="(item,index) in createdConfig.config.user_rule.rules[subscript].rules"> 
                    <thirdLayer  :subscript ='index' :sublength = 'sublen-1'  :createdConfig = "createdConfig" :userAttribute = "userAttribute" class="mg"></thirdLayer>
                </div>
            </div>
        </div>
    </template>
<script>
import thirdLayer from './third_layer/third_layer';
export default {
    data() {
        return {
            Attribute:'',
            condition:'',
            AttributeValueList:[],
            AttributeValue:''
        }
    },
    watch:{
        sublen(newValue,oldValue){
            if(newValue == 1){
                this.$parent.chnageParent(this.subscript);
            }   
        }      
    },
    props:['createdConfig','userAttribute','subscript','sublength'],
    computed:{
        AndOr(){
            return this.createdConfig.config.user_rule.rules[this.subscript].condition;
        },
        sublen(){
            return this.createdConfig.config.user_rule.rules[this.subscript].rules.length;
        }
    },
    methods: {
        /**
         * 切换且与或
         */
        switchConditon(){
            this.AndOr === 'and' ? this.createdConfig.config.user_rule.rules[this.subscript].condition = 'or' : this.createdConfig.config.user_rule.rules[this.subscript].condition = 'and';
        },
        addSecond(){
            this.createdConfig.config.user_rule.rules[this.subscript].rules.push({
                "property": "user.country",
                "operator": "equal",
                "values": [
                    "中国",
                    "美国"
                ]
            })
        },
        delSecond(subindex){
            if(this.createdConfig.config.user_rule.rules[this.subscript].rules.length > 1){
                this.createdConfig.config.user_rule.rules[this.subscript].rules.splice(subindex,1)
            }
        }
    },
    components: {
        thirdLayer
    }
}

</script>

